<template>
  <div>
    <h4 class="title">{{ message }} 牛呀</h4>
    <button @click="btnClick">我是按钮 点我试试</button>
    <h4>{{ name }}</h4>

    <hr />

    <Cpn></Cpn>
  </div>
</template>

<script>
import Cpn from "./Cpn";

export default {
  data() {
    return { message: "如何使用Vue呢？这是个问题", name: "Mr.chen" };
  },

  // 注册子组件
  components: {
    Cpn,
  },

  methods: {
    btnClick() {
      console.log("[点击] 别点了 点啥呀");
    },
  },
};
</script>

<style scoped>
.title {
  color: yellow;
}
</style>